<template>
    <view class="relative min-h-screen bg-[#F6F7F9]">
        <up-navbar title="地址管理" :safeAreaInsetTop="true" bgColor="#FFF" :placeholder="true">
			<template #left>
				<view class="flex px-[24rpx] py-[16rpx] border-[1rpx] border-slate-200 rounded-[38rpx]">
					<up-icon name="arrow-left" size="19" @click="goback"></up-icon>
					<up-line direction="column" :hairline="false" length="16" margin="0 8px"></up-line>
					<up-icon name="home" size="20" @click="gohome"></up-icon>
				</view>
			</template>
		</up-navbar>
        <view class="m-[16rpx] bg-[#fff] px-[20rpx]" v-for="(item,index) in list" :key="index">
            <view class="py-[20rpx] flex">
                <view class="text-center leading-[80rpx] text-[28rpx] text-[#999] font-normal mr-[16rpx] w-[80rpx] h-[80rpx] block rounded-[40rpx] bg-[#EFEFEF]">{{ item.receiveName.split('')[0] }}</view>
                <view class="">
                    <view class="flex items-center mb-[8rpx]" @click="checkAdd(item)">
                        <view class="text-[28rpx] text-[#101010] font-normal mr-[8rpx]">{{ item.receiveName }}</view>
                        <view class="text-[26rpx] text-[#999] font-normal">{{ item.mobile }}</view>
                    </view>
                    <view class="flex items-center">
                        <view class="w-[504rpx] text-[28rpx] text-[#101010] font-normal">{{ item.province }} {{ item.city }} {{ item.area }} {{ item.address }}</view>
                        <up-line direction="col" length="44rpx" margin="0 16rpx"></up-line>
                        <view @click="changeAddress(item.id)">
                            <image src="../static/updata.png" mode="scaleToFill" class="w-[40rpx] h-[40rpx] block"/>
                        </view>
                    </view>
                </view>
            </view>
            <up-line></up-line>
            <view class="flex justify-between items-center py-[26rpx]">
                <view class="flex items-center" @click="setDefault(item)">
                    <image v-if="item.isDefault" src="../static/gou-fill.png" mode="scaleToFill" class="w-[28rpx] h-[28rpx] block mr-[12rpx]"/>
                    <image v-else src="../static/kuang.png" mode="scaleToFill" class="w-[28rpx] h-[28rpx] block mr-[12rpx]"/>
                    <view class="text-[24rpx] text-[#999] font-normal">默认地址</view>
                </view>
                <view class="text-[24rpx] text-[#555] font-normal" @click="DelAddress(item.id)">删除</view>
            </view>
        </view>
        <view @click="wxAddress" class="m-[16rpx] bg-[#fff] px-[20rpx] py-[30rpx] flex justify-between items-center">
            <view class="text-[28rpx] text-[#101010] font-normal">获取微信收货地址</view>
            <image src="../static/right.png" mode="scaleToFill" class="w-[32rpx] h-[32rpx] block"/>
        </view>
        <view @click="checkAddress" class="flex justify-center items-center py-[14rpx] rounded-[8rpx] mt-[40rpx]" style="border: 1rpx dashed #ccc;margin: 0 36rpx;">
            <image src="../static/add.png" mode="scaleToFill" class="w-[32rpx] h-[32rpx] block mr-[12rpx]"/>
            <view class="text-[28rpx] text-[#ccc] block">添加地址</view>
        </view>
    </view>
</template>

<script setup>
import { onLoad  } from '@dcloudio/uni-app'
import { AddAddress, DeleteAddress, GetAddressList, UpdataAddress } from '../../API/user';
import { ref } from 'vue';
import { showToast } from '../../utils/utils';
let list = ref([])
function goback(){
    uni.navigateBack()
}
function gohome(){
    uni.switchTab({
        url:'/pages/index/index'
    })
}
function changeAddress(id){
    uni.navigateTo({
        url:'/community/addAddress/addAddress?id='+id
    })
}
function DelAddress(id){
    uni.showModal({
        title: '提示',
        content: '是否删除地址',
        showCancel: true,
        success: ({ confirm, cancel }) => {
            if (confirm) {
                DeleteAddress({id:id}).then(async (res)=>{
                    await getAddressList()
                })
            }
        }
    })
}
function checkAddress(id){
    uni.navigateTo({
        url:'/community/addAddress/addAddress?id='+id
    })
}
async function setDefault(item){
    let obj = item
    obj.isDefault = !item.isDefault
    let res = await UpdataAddress(obj)
    await getAddressList()
}
function wxAddress(){
    uni.chooseAddress({
        success: async ({ userName, telNumber, provinceName, cityName, countyName, detailInfo}) => {
            let res = await AddAddress({
                receiveName:userName,
                mobile:telNumber,
                province:provinceName,
                city:cityName,
                area:countyName,
                address:detailInfo,
                isDefault:false
            })
            showToast('添加成功')
            await GetAddressList()
        },
        fail: (error) => {}
    })
}
async function getAddressList (){
    let { data } = await GetAddressList()
    list.value = data
}
function checkAdd(item){
    uni.$emit('address',item)
    uni.navigateBack()
    // uni.navigateTo({
    //     url:'/pageOrder/ConfirmOrder/ConfirmOrder?address=' + encodeURIComponent(JSON.stringify(item))
    // })
}
onLoad(async ()=>{
    await getAddressList()
})
// onShow()(async()=>{

// })
</script>

<style lang="scss" scoped>

</style>